<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>

  <body>
    <script>
      function ajax1(t) {
        return new Promise((resolve) => {
          setTimeout(() => {
            resolve(t + "data");
          }, t);
        });
      }

      //   任务通过for循环依次执行异步任务
      let arr = [ajax1(10000), ajax1(1000), ajax1(3000)];
      async function syncFn() {
        console.log(33);
        for (let o = 0; o < arr.length; o++) {
          console.log("start", Date.now());
          const res = await arr[o];
          console.log(res);
          console.log("end", Date.now());
        }
      }
      /*
      start 1714289544359
异步遍历.html:27 10000data
异步遍历.html:28 end 1714289554367
异步遍历.html:25 start 1714289554367
异步遍历.html:27 1000data
异步遍历.html:28 end 1714289554367
异步遍历.html:25 start 1714289554367
异步遍历.html:27 3000data
异步遍历.html:28 end 1714289554367*/
      //   syncFn(); //结果是同步任务等待第一个10s后其它的任务会一起执行

      async function* test() {
        yield ajax1(10000);
        yield ajax1(1000);
        yield ajax1(3000);
      }

      //   const gg=test()
      // console.log(gg.next());//不加async 返回的是{value:'',done:''}
      // console.log(gg.next());//加async 返回的是Promise()然后通过promise返回{value:'',done:''}

      async function ttest() {
        const h = test();
        const ars = [h.next(), h.next(), h.next()];
        for await (let i of ars) {
          console.log("start", Date.now());
          console.log(i);
          console.log("end", Date.now());
        }
      }
      ttest();
    </script>
  </body>
</html>
